<!DOCTYPE html>
<html>

<head>
    <title>黑马顺风车</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="../css/jquery.mobile-1.4.5.min.css">
    <script src="../js/jquery-1.11.3.min.js"></script>
    <script src="../js/jquery.mobile-1.4.5.min.js"></script>
    <link rel="stylesheet" href="../css/common.css" />
    <script type="text/javascript" src="../js/common.js"></script>
    <style>
        html,
        body {
            padding: 0;
            margin: 0;
        }

        table .h {
            width: 100px;
            height: 50px;
            font-weight: bold;
        }

        img {
            width: 100%;
            height: 100%;
            max-height: 180px;
        }
    </style>
    <script>
        $(function () {
            $('li').eq(0).removeClass('ui-first-child');

            $("input[type='file']").change(function () {
                var objUrl = getLocalUrl(this.files[0]);
                if (objUrl) {
                    $(this).parent().prev('img').attr("src", objUrl);
                }
            });
        })

        function confirmCallBack(id) {
            formToJson('#info');
        }

    </script>
</head>

<body>

    <div data-role="page" id="pageone">
        <div data-role="header" data-position="fixed" data-tap-toggle="false">
            <a href="#" data-rel="back"
                class="ui-btn ui-btn-inline ui-icon-arrow-l ui-btn-icon-notext ui-corner-all">使用圆圈（默认）</a>
            <h1>车主认证</h1>
        </div>
        <form id="info">

            <ul data-role="listview" data-inset="true" id="defaultpanel" style="margin:15px;">
                
                <li>
                    <table>
                        <tr>
                            <td class="h">驾驶本：</td>
                        </tr>
                        <tr>
                            <td><img src="../img/0707.png">
                                <input type="file" accept="image/png" name="cardIdFrontPhoto" />
                            </td>
                        </tr>
                        <tr>
                            <td class="h">行驶证：</td>
                        </tr>
                        <tr>
                            <td><img src="../img/0707.png">
                                <input type="file" accept="image/png" name="cardIdBackPhoto" />
                            </td>
                        </tr>
                        <tr>
                            <td class="h">车辆照片：</td>
                        </tr>
                        <tr>
                            <td><img src="../img/0707.png">
                                <input type="file" accept="image/png" name="cardIdBackPhoto" />
                            </td>
                        </tr>

                    </table>
                </li>
                <li>
                    <p>
                        <a href="#myPopupDialog" data-rel="popup" data-position-to="window" data-mini="true"
                            data-transition="fade"
                            class="popup-btn ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-active"
                            show-txt="保存最新设置吗？" id="acceptTrip" style="width:80px;float:right;">提交</a>
                    </p>
                </li>
            </ul>

        </form>
        <div data-role="footer" data-position="fixed" data-tap-toggle="false">
            <div data-role="navbar" style="margin: 0;">
                <ul>
                    <li><a href="javascript:location.href='user.html'" data-icon="home">首页</a>
                    </li>
                    <li><a href="javascript:location.href='trip.html'" data-icon="grid">我的行程</a></li>
                    <li><a href="javascript:location.href='order.html'" data-icon="bullets">我的订单</a></li>
                    <li><a href="javascript:location.href='../common/userCenter.html'" data-icon="user"
                            class="ui-btn-active">个人中心</a></li>
                </ul>
            </div>
        </div>
    </div>

</body>

</html>